<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  
  <head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
 	<link rel="stylesheet" href="../static/css/back/font.css">
 	<link rel="stylesheet" href="../static/css/back/role.css">
    <link rel="stylesheet" href="../static/css/back/xadmin.css">
    <script type="text/javascript" src="../static/js/jquery-2.1.1.min.js"></script>
    
    <script type="text/javascript" src="../static/js/back/xadmin.js"></script>
    <script type="text/javascript" src="../static/js/back/ajax.js"></script>
<!--     <script type="text/javascript" src="../static/js/back/shop-info.js"></script> -->
<style type="text/css">
tr th:nth-child(1),  tr td:nth-child(1) {
	border-right: 0;
}
tr th:nth-child(2) , tr td:nth-child(2) {
	border-left: 0;
}
td span {
	    position: absolute;
    right: 20px;
}
.times{
	height: 25px;
	    width: 70px;
}
.laydate-time-list>li:nth-child(3){
	display: none; 
}
</style>
</head>
  
  <body>
    <div class="x-body">
    <input type="hidden" id="test9-1">
      <table class="layui-table">
        <thead>
          <tr>
            <th>开始时间</th>
            <th>结束时间</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
    <button class="layui-btn" id="test9" >添加营业时间</button>
    <button class="layui-btn" onclick="saveTime()">保存</button>
    </div>
    <script>
    layui.use('laydate', function(){
    	  var laydate = layui.laydate;
    	//时间范围
    	  laydate.render({
    	    elem: '#test9-1'
    	    ,type: 'time'
    	    ,range: true
    	    ,format: 'HH:mm'
    	    ,eventElem: '#test9'
    	    ,trigger: 'click'
    	    ,done: function(value, date, endDate){
 	    		if(value){
	 	    		 var html = ' <tr> <td name="startTime">'
	 	    		 			+ value.split("-")[0]
	 	    		 			+'</td><td name="endTime">'
	 	            			+ value.split("-")[1]
	 	            			+'<span><a title="删除" onclick="del_time(this)" href="javascript:;"> <i class="iconfont icon-delete x-red"></i></a></span></td></tr>';
	 	    		$('.layui-table tbody').append(html);		    
 	    		}
   		   }
    	  });
    })
    function del_time(obj){
    	$(obj).parent().parent().parent().remove();
    }
    var spid = getCookie('shop_id');
    function  saveTime(){
    	var _map = {};
    	var str = $('td[name="startTime"]');
    	var end = $('td[name="endTime"]');
    	var openHours = "";
    	for (var i = 0; i < str.length; i++) {
			var start = str[i];
			var endrt = end[i];
			openHours += $(start).text().replace('','').trim() + '-' + $(endrt).text().replace('','').trim();
			if((i+1)!=str.length){
				openHours= openHours.trim() + ',';
			}
		}
    	_map['id']=  spid;
    	_map['openHours']= openHours;
    	_ajax_post_token('../shop/updateShopInfoOnly.do',_map,function(res){
    		 layer.msg('保存成功!',{icon:6,time:2000});
    		 x_admin_close();
    		 parent.getList();
    	});
    }
    $(function(){
    	_ajax_post_token('../shop/getShopById',{id:spid},function(res){
    		console.log(res);
    		if(res.returnObject){
    			var tims = res.returnObject.openHours;
    			var ts = tims.split(',');
    			var html = '';
    			console.log(ts);
    			for (var i = 0; i < ts.length; i++) {
					html =' <tr> <td name="startTime">'
	    		 			+ ts[i].split("-")[0]
		 		 			+'</td><td name="endTime">'
		         			+ ts[i].split("-")[1]
		         			+'<span><a title="删除" onclick="del_time(this)" href="javascript:;"> <i class="iconfont icon-delete x-red"></i></a></span></td></tr>';
		 					$('.layui-table tbody').append(html);		
				}
    		}
    	});
    	
    })
    </script>
  </body>
</html>